import React, { useState } from 'react'
import Header from '../layout/Header'
import Search from '../layout/Search'
import Main from '../layout/Main'
import { Button } from 'antd'
export default function ProcurementAndWarehousing() {
  const [status, SetStatus] = useState(3)
  const [searchHeight, SetsearchHeight] = useState('100px')
  const [columns, SetColumns] = useState([
    {
      title: '单据编号',
      dataIndex: 'documentnumber',
      key: 'documentnumber',
    },
    {
      title: '往来单位',
      dataIndex: 'name',
      key: 'name',
    },
    {
      title: '入库类型',
      dataIndex: 'type',
      key: 'type',
    },
    {
      title: '入库仓库',
      dataIndex: 'warehouse',
      key: 'warehouse',
    },
    {
      title: '预计入库量',
      dataIndex: 'count',
      key: 'count',
    },
    {
      title: '实际入库量',
      dataIndex: 'counts',
      key: 'counts',
    },
    {
      title: '入库状态',
      dataIndex: 'status',
      key: 'status',
    },
    {
      title: '备注',
      dataIndex: 'remark',
      key: 'remark',
    },
    {
      title: '入库时间',
      dataIndex: 'createtime',
      key: 'createtime',
    },
    {
      title: '操作',
      dataIndex: 'operate',
      key: 'operate',
      render: (text: any, record: any) => {
        const { status } = record;
        return <div>
          {
            status === '待入库' && <div>
              <Button>入库</Button>
              <Button>详情</Button>
            </div>
          }
          {
            status === '已入库' && <div>
              <Button>详情</Button>
            </div>
          }
          {
            status === '部分入库' && <div>
              <Button>入库</Button>
              <Button>详情</Button>
            </div>
          }

        </div>
      }
    },
  ])
  const [list, SetList] = useState([
    {
      id: 1,
      documentnumber: "CG203506092356",
      name: "聚沙商贸",
      type: "采购入库",
      warehouse: "华北2仓",
      creator: "周杰伦",
      count: 2000,
      counts: 0,
      status: 1,
      createtime: "2035-09-19 9:39:39",
      remark: '-'
    }, {
      id: 2,
      documentnumber: "CG203506092356",
      name: "聚沙商贸",
      type: "采购入库",
      warehouse: "华北2仓",
      creator: "周杰伦",
      count: 2000,
      counts: 0,
      status: 1,
      createtime: "2035-09-19 9:39:39",
      remark: '-'
    }, {
      id: 3,
      documentnumber: "CG203506092356",
      name: "聚沙商贸",
      type: "采购入库",
      warehouse: "华北2仓",
      creator: "周杰伦",
      count: 2000,
      counts: 0,
      status: 1,
      createtime: "2035-09-19 9:39:39",
      remark: '-'
    },
    {
      id: 4,
      documentnumber: "CG203506092356",
      name: "聚沙商贸",
      type: "采购入库",
      warehouse: "华北2仓",
      creator: "周杰伦",
      count: 2000,
      counts: 0,
      status: 1,
      createtime: "2035-09-19 9:39:39",
      remark: '-'
    },
    {
      id: 5,
      documentnumber: "CG203506092356",
      name: "聚沙商贸",
      type: "采购入库",
      warehouse: "华北2仓",
      creator: "周杰伦",
      count: 2000,
      counts: 0,
      status: 2,
      createtime: "2035-09-19 9:39:39",
      remark: '-'
    },
    {
      id: 6,
      documentnumber: "CG203506092356",
      name: "聚沙商贸",
      type: "采购入库",
      warehouse: "华北2仓",
      creator: "周杰伦",
      count: 2000,
      counts: 0,
      status: 2,
      createtime: "2035-09-19 9:39:39",
      remark: '-'
    },
    {
      id: 7,
      documentnumber: "CG203506092356",
      name: "聚沙商贸",
      type: "采购入库",
      warehouse: "华北2仓",
      creator: "周杰伦",
      count: 2000,
      counts: 0,
      status: 3,
      createtime: "2035-09-19 9:39:39",
      remark: '-'
    },
    {
      id: 8,
      documentnumber: "CG203506092356",
      name: "聚沙商贸",
      type: "采购入库",
      warehouse: "华北2仓",
      creator: "周杰伦",
      count: 2000,
      counts: 0,
      status: 3,
      createtime: "2035-09-19 9:39:39",
      remark: '-'
    },
    {
      id: 9,
      documentnumber: "CG203506092356",
      name: "聚沙商贸",
      type: "采购入库",
      warehouse: "华北2仓",
      creator: "周杰伦",
      count: 2000,
      counts: 0,
      status: 1,
      createtime: "2035-09-19 9:39:39",
      remark: '-'
    },

  ])
  const [pageSize, SetPageSize] = useState(5)
  const [page, SetPage] = useState(1)
  const paginationConfing = {
    page: page,
    total: list.length,
    pageSize: pageSize,
    showSizeChanger: true,
    pageSizeOptions: ['2', '3', '4', '5'],
    onchange: (page: number) => {
      SetPage(page)
    },
    onShowSizeChange: (current: number, size: number) => {
      SetPageSize(size)
      SetPage(current)
    }
  }
  return (
    <div>
      <Header status={status} />
      <Search status={status} searchHeight={searchHeight} />
      <Main status={status} columns={columns} list={list} paginationConfing={paginationConfing} />
    </div>
  )
}
